// 交通事故弹窗
'use client'
import Styles from '../../page.module.scss'
import React, { useState } from 'react'
import { Button, Modal } from 'antd'
import Image from 'next/image'
import { useHomeShare } from '@/hooks/use-home-share'

type TrafficDialogProps = {
  isModalOpen: boolean
  setIsModalOpen: () => void
  // location: [number, number] | null
}
const TrafficDialog: FC<TrafficDialogProps> = ({ isModalOpen, setIsModalOpen }) => {
  // const { isDialogOpen, setIsDialogOpen } = useHomeShare()
  // const [isModalOpen, setIsModalOpen] = useState(false)

  const showModal = () => {
    // setIsModalOpen(true)
  }

  const handleOk = () => {
    setIsModalOpen(false)
  }

  const handleCancel = () => {
    setIsModalOpen(false)
  }

  return (
    <Modal
      title='Basic Modal'
      open={isModalOpen}
      onOk={handleOk}
      onCancel={handleCancel}
      width={850}
      centered
      footer={null}>
      <div className={`flex justify-between items-center ${Styles['home-modal']}`}>
        <div>
          <Image
            src='/mg_logo.png'
            alt='mogo logo'
            width={320}
            height={180}
          />
        </div>

        <div className={`${Styles['common-text']}`}>
          <div>
            <span>事故地点：</span>
            <span>蔡伦达到与钢管厂交叉口北100米处</span>
          </div>
          <div>
            <span>事故类型：</span>
            <span>车辆剐蹭</span>
          </div>
          <div>
            <span>发生时间：</span>
            <span>车辆剐蹭</span>
          </div>
          <div>
            <span>事故等级：</span>
            <span>车辆剐蹭</span>
          </div>
          <div>
            <span>事故过程分析：</span>
            <span>车辆剐蹭</span>
          </div>
          <div>
            <span>事故影响：</span>
            <span>车辆剐蹭</span>
          </div>
          <div>
            <span>处理建议：</span>
            <span>车辆剐蹭</span>
          </div>
          <div className={`flex`}>
            <Button type='primary'>推送执勤终端</Button>
            <Button type='primary'>同步指挥中心</Button>
            <Button type='primary'>同步路口屏幕</Button>
          </div>
        </div>
      </div>
    </Modal>
  )
}

export default TrafficDialog
